<h4 class="mb-3">1.IPv4</h4>
<ti-ip id="ip-basic-ipv4" [(ngModel)]="ipv4Value" [version]="4"></ti-ip>
<div class="current-value-container mb-3">
  <pre>Current Value: {{ ipv4Value }}</pre>
</div>

<h4 class="mb-3">2.IPv6</h4>
<ti-ip id="ip-basic-ipv6" [(ngModel)]="ipv6Value" [version]="6"></ti-ip>
<div class="current-value-container mb-3">
  <pre>Current Value: {{ ipv6Value }}</pre>
</div>
<br />
<ti-ip id="ip-basic-ipv6-abbreviated" [(ngModel)]="ipv6ValueAbbreviated" [version]="6"></ti-ip>
<div class="current-value-container">
  <pre>Current Value: {{ ipv6ValueAbbreviated }}</pre>
</div>
